<template>
	<view class="body">
		<view class="bg-white">
			<view class="card p40 m20">
				<view class="d-b-c white">
					<text>1234567891011</text>
					<text>e账户</text>
				</view>
				<view class="d-s-c white mt80 pt80">
					<view class="d-s-c flex-1">
						<text class="mr5">积分</text>
						<text>0.0积分</text>
					</view>
					<text class="d-s-c flex-1">
						<text class="mr5">卡余额</text>
						<text>￥0.00</text>
					</text>
				</view>
			</view>
			<u-tabs :list="menu" :current='mIndex' lineColor='#FF7E11' activeStyle='color:#FF7E11' :scrollable='false'
				@change="setAct"></u-tabs>
		</view>
		<view class="top d-b-c p30">
			<picker class="picker bg-white br28 pt10 pb10 pl30 pr30" mode="date" fields='month'>
				<view class="d-b-c">
					<text class="mr5">2025-02</text>
					<u-icon name="arrow-down-fill" size="12"></u-icon>
				</view>
			</picker>
			<view class="">总支出：0.00</view>
		</view>
		<view class="list">
			<view class="item bg-white p30 mb30" v-for="(item,index) in list" :key="index">
				<view class="d-b-c">
					<text>{{item.date}}</text>
					<text class="gray6">{{item.static==1?'交易成功':'交易失败'}}</text>
				</view>
				<view class="d-b-c mt30">
					<text>{{item.name}}</text>
					<text>￥{{item.price}}</text>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				menu: [{
					name: "订单查询"
				}, {
					name: "卡账单"
				}, {
					name: "积分账单"
				}],
				mIndex: 0,
				list: [{
					date: '2025-02-12 15:00:01',
					price: '0.00',
					name: "江门利杰能源加油",
					static: 1
				}, {
					date: '2025-02-12 15:00:01',
					price: '0.00',
					name: "江门利杰能源加油",
					static: 1
				}, {
					date: '2025-02-12 15:00:01',
					price: '0.00',
					name: "江门利杰能源加油",
					static: 1
				}, {
					date: '2025-02-12 15:00:01',
					price: '0.00',
					name: "江门利杰能源加油",
					static: 1
				}, {
					date: '2025-02-12 15:00:01',
					price: '0.00',
					name: "江门利杰能源加油",
					static: 1
				}]
			}
		},
		methods: {
			setAct({ index }) {
				this.mIndex = index
			}
		}
	}
</script>

<style lang="scss" scoped>
	.picker {
		// b
	}

	.body {
		background-color: #f4f4f4;
		min-height: 100vh;
	}

	.card {
		border-radius: 30rpx 30rpx 0 0;
		box-shadow: 10rpx 10rpx 10rpx rgba(0, 0, 0, 0.4);
		background-color: #165DFF;
	}
</style>